// pages/musicdetails.js
// 请自行替换音频文件网络路径！！！
// 请自行替换音频文件网络路径！！！
// 请自行替换音频文件网络路径！！！

// 创建音频对象(用于播放音频)
const AudioContext = wx.createInnerAudioContext()

Page({

  data: {

    musicBuildings:[
      {
        id:2,
        musicList: [
          {
            title: '李庆勋 - 岳阳楼',
            file: 'https://main-bucket-1317028681.cos.ap-guangzhou.myqcloud.com/music/Jeffv%20-%20%E5%B2%B3%E9%98%B3%E6%A5%BC%E8%AE%B0.mp3'
          },
          {
            title: 'Kyle Xian - Prayer X',
            file: 'https://main-bucket-1317028681.cos.ap-guangzhou.myqcloud.com/music/Kyle%20Xian%20-%20Prayer%20X.mp3'
          },
        ]
      }
    ],

    // 音乐列表
    musicList: [
      {
        title: '李庆勋 - 岳阳楼',
        file: 'https://main-bucket-1317028681.cos.ap-guangzhou.myqcloud.com/music/Jeffv%20-%20%E5%B2%B3%E9%98%B3%E6%A5%BC%E8%AE%B0.mp3'
      },
      {
        title: 'Kyle Xian - Prayer X',
        file: 'https://main-bucket-1317028681.cos.ap-guangzhou.myqcloud.com/music/Kyle%20Xian%20-%20Prayer%20X.mp3'
      },
    ],

    // 当前播放音频的索引(控制图标切换与暂停播放)
    current: null,
  },
  
  //点击楼阁图片
  toDetails: function(e){
    const id = e.currentTarget.dataset.id
    wx.navigateTo({
      url: '/pages/buildingdetails/buildingdetails?id='+id,
    })
  },

  /**
   * 点击播放与暂停
   * @description 改变播放图标与开始播放、暂停音频
   * @param {Object} e - 行数据
   * @return void
   */
  clickPlay(e) {
    // 当前行数据
    const row = e.currentTarget.dataset.item
    // 当前索引
    const index = e.currentTarget.dataset.index

    // 暂停播放
    if (this.data.current == index) {
      // 暂停播放并重置索引
      AudioContext.pause()
      this.setData({ current: null })
      this.toast('暂停')
    }

    // 从头开始播放
    else {
      // 设置为自动播放(必须)
      AudioContext.autoplay = true
      // 设置播放链接
      AudioContext.src = row.file
      // 开始播放并设置索引
      AudioContext.play()
      this.setData({ current: index })
      this.toast('播放')
    }

    // 监听播放自然结束
    AudioContext.onEnded(() => {
      // 重置索引
      this.setData({ current: null })
      this.toast('播放完成')
    })
  },

  /**
   * 提示封装
   */
  toast(title) {
    wx.showToast({
      title: title,
      icon: 'none'
    })
  },

  /**
   * 生命周期函数-监听页面隐藏(离开页面后，必须重置状态)
   * onHide() / onUnload() 哪个都行，有些二级页面不执行 onHide()！ 
   */
  onHide() {
    console.log('页面隐藏了！')
    // 停止音频,下次从头播放
    AudioContext.stop()
    // 重置当前播放索引
    this.setData({ current: null })
  },

  backlink: function () {
    console.log("点击返回按钮......")
    wx.navigateBack({
      delta: 1 //返回上一级页面
    })
  },

  // onUnload(){ ... }

})
